<template>
  <div class="table-list">
    <dv-scroll-board :config="config" class="table" style="height:27.5vh" />
    <!--height:46vh  -->
  </div>
</template>

<script>
export default {
  name: '',
  props: {
    headerList: {
      type: Array,
      default: () => [],
    },
    dataList: {
      type: Array,
      default: () => [],
    },
    eqNum: {
      type: Object,
      default: () => {
        return {}
      },
    },
  },
  watch: {
    dataList(newData) {
      this.config = {
        header: this.headerList,
        headerHeight: 30,
        data: newData,
        index: true,
        columnWidth: [100, 300, 200, 250, 400, 300, 300],
        align: [
          'center',
          'center',
          'center',
          'center',
          'center',
          'center',
          'center',
        ],
        headerBGC: ' ',
        oddRowBGC: ' ',
        evenRowBGC: 'rgba(52,99,171,0.15)',
        waitTime: '5000',
        rowNum: 7,
      }
    },
  },
  data() {
    return {
      config: null,
      vw: 0,
      num: {
        run: 10,
        wait: 6,
        off: 4,
      },
    }
  },
  created() {
    this.vw = window.screen.width
    this.config = {
      header: this.headerList,
      headerHeight: 30,
      data: this.dataList,
      index: true,
      columnWidth: [100, 300, 200, 250, 400, 300, 300],
      align: [
        'center',
        'center',
        'center',
        'center',
        'center',
        'center',
        'center',
      ],
      headerBGC: ' ',
      oddRowBGC: ' ',
      evenRowBGC: 'rgba(52,99,171,0.15)',
      waitTime: '5000',
      rowNum: 7,
    }
  },
  methods: {},
}
</script>

<style lang="less" scoped>
.table-list {
  position: relative;
}

.circle {
  width: 1rem;
  height: 1rem;
  border-radius: 20px;
  display: inline-block;
  margin-right: 5px;
}

.table {
  // padding: 6rem 2rem 0rem 2rem;
  color: #ccc;
}
</style>
